<%@ page pageEncoding="UTF-8"%>
<%@ include file="../common/global.jsp"%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="../common/meta.jsp"%>
<title><f:message key="common.title" /> - <f:message key="user" /></title>
<%@ include file="../common/css.jsp"%>
</head>
<body>
<div id="wrapper">
<%@ include file="../common/topbar.jsp"%>
<%@ include file="../common/header.jsp"%>

    <div id="masthead">

        <div class="container">

            <div class="masthead-pad">

                <div class="masthead-text">
                    <h5>添加公众号</h5>
                </div> <!-- /.masthead-text -->

            </div>

        </div> <!-- /.container -->

    </div> <!-- /#masthead -->

    <div id="content">

        <div class="container">

            <div class="row">

                <div class="span12">

					  <form class="form-horizontal" id="account_create_form" novalidate="novalidate">
                            <fieldset>

                            <div class="control-group">
                                <label class="control-label" for="account">账号:</label>
                                <div class="controls">
                                    <input type="text" id="account" name="account"  class="input-large">
                                </div>
                            </div>

                            <div class="control-group">
                                <label class="control-label" for="password">密码:</label>
                                <div class="controls">
                                    <input type="text" class="input-large" name="password" id="password">
                                </div>
                            </div>

                            <div class="control-group">
                                <label class="control-label" for="password">token:</label>
                                <div class="controls">
                                    <input type="text" class="input-large" name="token" id="token">
                                </div>
                            </div>

                            <div class="control-group">
                                <label class="control-label" for="appid">appid:</label>
                                <div class="controls">
                                    <input type="text" class="input-large" name="appid" id="appid">
                                </div>
                            </div>

                            <div class="control-group">
                                <label class="control-label" for="appsecret">appsecret:</label>
                                <div class="controls">
                                    <input type="text" class="input-large" name="appsecret" id="appsecret">
                                </div>
                            </div>

                            <div class="form-actions">
                                <button type="submit" class="btn btn-default">
                                    <f:message key="common.save" />
                                </button>
                                <button type="button" id="back" class="btn btn-default">
                                    <f:message key="common.back" />
                                </button>
                            </div>
                            </fieldset>
					</form>

            </div><!-- /.span12 -->

    </div> <!-- /.row -->

</div> <!-- /.container -->

</div> <!-- /#content -->

</div> <!-- /#wrapper -->

<%@ include file="../common/footer.jsp"%>
<%@ include file="../common/js.jsp"%>
<script src="${BASE}/www/js/plugins/validate/jquery.validate.js"></script>


<script type="text/javascript">
    $(function() {
        var rules = {
            rules: {
                account: {
                    minlength: 2,
                    required: true
                },
                token: {
                    minlength: 2,
                    required: true
                }
            }
        };

        var validationObj = $.extend (rules, getValidationRules());
        $('form').validate(validationObj);

        $('#account_create_form').ajaxForm({
            type: 'post',
            url: BASE + '/account',
            dataType: 'json',
            beforeSubmit: function() {
                return Smart.Validator.checkRequired('account_create_form');

            },
            success: function(result) {
                if (result.success) {
                    location.href = BASE + '/accounts';
                }
            }
        });

    });

    function getValidationRules () {
        var custom = {
            focusCleanup: false,
            wrapper: 'div',
            errorElement: 'span',

            highlight: function(element) {
                $(element).parents ('.control-group').removeClass ('success').addClass('error');
            },
            success: function(element) {
                $(element).parents ('.control-group').removeClass ('error').addClass('success');
                $(element).parents ('.controls:not(:has(.clean))').find ('div:last').before ('<div class="clean"></div>');
            },
            errorPlacement: function(error, element) {
                error.appendTo(element.parents ('.controls'));
            }

        };

        return custom;
    }

</script>
</body>
</html>